<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>主页</title>
    <link rel="stylesheet" href="../../css/main/main.css">
</head>
<body>
    <div id="toptb">
        <div id="z">
            <a href="javascript:;">设为首页</a>
            <a href="javascript:;">收藏本站</a>
        </div>
    </div>
    <!-- 顶部部分 -->
    <div id="banner">
        <div class="header">
            <div class="nav-link">
                <ul class="nav-link-ul">
                    <li class="nav-link-item"><a href="#">一</a></li>
                    <li class="nav-link-item"><a href="#">二</a></li>
                    <li class="nav-link-item"><a href="#">三</a></li>
                    <li class="nav-link-item"><a href="#">四</a></li>
                    <li class="nav-link-item"><a href="#">五</a></li>
                </ul>
            </div>
            <div class="searchbox">
                <!-- <div class="search"> -->
                    <form action="" id="searchform">
                            <input type="text" id="srch">
                            <!-- <div class="searchbtn">
                                <button type="button" class="button">搜索</button>
                            </div> -->
                            <input type="submit" value="搜索" id="btn">
                    </form>
                <!-- </div> -->
            </div>
            <div class="nac-user-center">
                <div class="user-icon"><a href="#">
                    <!--点击这里会跳转到个人中心-->
                    头像，用户名</a></div>
                <div class="usersignin">
                    <div class="item">
                        <!--我的点击后会浮动出帖子，收藏-->
                        <a href="#">我的</a>
                        </div>
                    <div class="item">
                        <!-- 点击发帖跳转到发帖界面 -->
                        <a href="#">发帖</a>
                        </div>
                    <div class="item">
                        <a href="#">组织管理</a>
                        </div>
                    <div class="item">
                        <a href="#">账号切换</a>
                        </div>
                    <div class="item">
                        <a href="#">退出</a>
                        </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 中层部分 -->
    <div id="module">
        <div id="first">
            <table>
                <thead>
                  <tr style="background-color: gray;">
                    <th>模块一</th>
                    <th>模块二</th>
                    <th>模块三</th>
                    <th>模块四</th>
                  </tr>
                </thead>
              
                <tbody>
                  <tr style="background-color: black;color: white;">
                    <td>模块五</td>
                    <td>模块六</td>
                    <td>模块七</td>
                    <td>模块八</td>
                  </tr>
                </tbody>
            </table>
        </div>
        <div id="second">
            <div class="z">
                <!-- 轮播图 -->
                <a href="javascript:void(0)">
                    <img src="../../images/main/l-btn.png" alt="" id="l-btn">
                </a>
                <a href="#">
                    <img id="looppic" src="../../images/main/428F27372BFAABB1818C903F54C_7187F729_19D3B.jpg" width="640px" height="500px" alt="">
                </a>
                <a href="javascript:void(0)">
                    <img src="../../images/main/r-btn.png" alt="" id="r-btn">
                </a>
            </div>
            <div id="dot">
                <span></span>
                <span></span>
                <span></span>
                <span></span>
                <span></span>
            </div>
            <div class="y">
                最热帖
            </div>
        </div>
    </div>
    <!-- 轮播图实现 -->
    <!-- <script>
        window.onload=function(){
            document.getElementById("l-btn").onclick=f1;
            document.getElementById("r-btn").onclick=f2;

            document.getElementById("l-btn").onmouseenter=function(){
                // 清除轮播
                clearInterval(interval);
            }
            document.getElementById("l-btn").onmouseleave=function(){
                // 开始轮播
                interval = setInterval(f1,3000);
            }
            document.getElementById("r-btn").onmouseenter=function(){
                // 清除轮播
                clearInterval(interval);
            }
            document.getElementById("r-btn").onmouseleave=function(){
                // 开始轮播
                interval = setInterval(f1,3000);
            }
            // document.getElementById("dot")

        }
        var images=[
            "64A4365FD64265F6AC244B048E2_1599CA3A_13F92.jpg",
            "428F27372BFAABB1818C903F54C_7187F729_19D3B.jpg",
            "ACB9E839523BD4AE89B156634F0_32D49921_29D1C.jpg",
            "B9C023481E81D9D36A75F8A8E35_ACA55A12_18F04.jpg",
            "EBCCF52DB64EF04C60D45E6FA6D_859E08DD_157A6.jpg"
        ];
        var n =0;
        function f1(){
            n++;
            if(n>4){
                n=0;
            }
            document.getElementById("looppic").src=images[n];
        }
        function f2(){
            n--;
            if(n<0){
                n=images.length-1;
            }
            document.getElementById("looppic").src=images[n];
        }
        var interval = setInterval(f1,3000);
    </script> -->
    <script src="../../js/main/looping.js"></script>
</body>
</html>